<template>
    <div class="login-div-con">
        <div class="col-md-12 log text-center">
            <h1>梦想改造家-注册</h1>
            <p style="color:red;" id="errpass">{{tips}}</p>
        </div>
        <form action="" class="col-md-12" name="register_form" id="register_form">
            <input type="text" class="input-text padding-top1"
                   placeholder="登录名" name="zhuang_user" id="zhuang_user" v-model="user.tel">
            <div class="col-md-12" style="height: 30px"></div>
            <input type="password" class="input-text padding-top1"
                   placeholder="密码" name="zhuang_pass" id="zhuang_pass" v-model="user.pass">
            <div class="col-md-12" style="height: 30px"></div>
            <input type="password" class="input-text padding-top1"
                   placeholder="再次输入" name="zhuang_pass2" id="zhuang_pass2" v-model="user.pass2">
            <div class="col-md-12" style="height: 50px"></div>
            <div class="col-sm-12 col-xs-12 col-md-12 float-right">
                <input type="button" class="login-btn float-right" value="注册" name="zhuang_register" id="zhuang_register" v-on:click="goRegister">
                <a href="login" class="float-right">已有账号去登陆</a>
            </div>
        </form>
    </div>
</template>
<script>
    import static_config from '../../../../tools/config';
    import cook from '../../../../tools/cookies'
    export default{
        data(){
            return {
                user:{
                    tel:'',
                    pass:'',
                    pass2:''
                },
                tips:''
            }
        },
        methods:{
        /**
        *  注册方法
        *  利用了vue的vue-resource替代jquery
        **/
            goRegister: function () {
                var tel = this.user.tel;
                var pass = this.user.pass;
                var pass2 = this.user.pass2;
                var data = this.user;
                //todo 判断用户名长度 大于11提醒（最好默认用户名是手机号）
                var telReg = /^1[3|4|5|8][0-9]\d{4,8}$/;
                if(!(telReg.test(tel))){
                    this.tips = '用户名不合法';
                }else if(pass == pass2){
                    this.$http.post('/users/register', data)
                        .then(function (res) {
                            if(res.body.register){
                                this.tips = '';
                                //todo 前端保存登录信息
                                cook.setCookie('user',tel);
                                sessionStorage.setItem('user',tel);
                                window.location.href = static_config.option.host;
                            }else{
                                this.tips = '用户名已存在，请重新输入'
                            }
                        },function(err){
                            console.log(err);
                        });
                }else{
                    this.tips = '密码输入不一致，请重新输入'
                }
            }
        }
    }
</script>
